﻿<div class="page-content animated fadeInDown">
    <div class="container-fluid pb-100">
        <div class="row" id="form">
            <div class="col-sm-6" style="display:none">
                <h4 class="example-title">id</h4>
                <input class="form-control" type="text" id="gid" placeholder="id">
            </div>
            <!--检索面板-->
            <div class="col-sm-6">
                <h4 class="example-title">菜单编号</h4>
                <input class="form-control" type="text" id="menu_Num" placeholder="A 或者 A-100">
            </div>

            <div class="col-sm-6">
                <h4 class="example-title">菜单名称</h4>
                <input class="form-control" type="text" id="menu_Name" placeholder="请输入菜单名称">
            </div>

            <div class="col-sm-6">
                <h4 class="example-title">菜单Href</h4>
                <input class="form-control" type="text" id="menu_Url" placeholder="请输入菜单Href 如：/Admin/User/Index">
            </div>

            <div class="col-sm-6">
                <h4 class="example-title">菜单图标</h4>
                <div class="input-group">
                    <div class="input-group-addon"><i id="menu_Iconi"></i></div>
                    <input type="text" class="form-control" id="menu_Icon" placeholder="请输入菜单图标 如：fa fa-desktop">
                    <div class="input-group-addon" id="selectIcon">...</div>
                </div>
            </div>

            <div class="col-sm-6">
                <h4 class="example-title">父级菜单</h4>
                <input class="form-control" type="text" id="menu_ParentID" disabled="disabled" style="display:none">
                <input class="form-control" type="text" id="menu_ParentName" disabled="disabled">
            </div>

            <div class="col-sm-6">
                <h4 class="example-title">是否显示</h4>
                <select class="form-control" id="menu_IsShow">
                    <option value="">==是否显示 该菜单==</option>
                    <option value="1">是</option>
                    <option value="2">否</option>
                </select>
            </div>
            <div class="col-sm-12">
                <h4 class="example-title">菜单权限</h4>
                <div class="row" id="functions">

                </div>
            </div>

        </div>
    </div>
</div>


<script type="text/javascript">
    $(function () {
        $.ajax({
            url: '@Url.Action("GetFunction")',
            type: 'get',
            data: 'json',
            success: function (data) {
                $('#functions').empty();
                var str = "";
                for (var i = 0; i < data.length; i++) {
                    str += '<div class="col-sm-3"><div class="checkbox"><label><input type="checkbox" name="Function_ID" value="' + data[i].gid + '">' + data[i].function_Name + '</label></div></div>';
                }
                $('#functions').append(str);
            },
            error: function () {
                layer.alert('发生错误', {
                    skin: 'layui-layer-molv',
                    closeBtn: 0
                });
            }
        });

        $("#selectIcon").click(function () {
            layer.open({
                type: 2, //因为layer弹出层需要一个页面，所以是iframe弹出层，因此type: 2。
                title: '选择图标',
                shadeClose: true,
                shade: false,
                area: ['100%', '70%'],
                content: '/Home/LookIcon',
                zIndex: layer.zIndex, //重点1
                btn: ['确定', '关闭'],
                success: function (layero, index) {
                    layer.setTop(layero); //重点2
                    var icon = $.trim($('#menu_Icon').val());
                    if (icon != null) {
                        var body = layer.getChildFrame('body', index);  //巧妙的地方在这里哦
                        body.contents().find("#icontext").val(icon);
                    }
                },
                yes: function (index) {
                    var txt = document.all.returnValue;
                    $('#menu_Icon').val(txt);
                    $('#menu_Iconi').removeClass().addClass(txt);
                    layer.close(index);
                },
                cancel: function () {
                    //右上角关闭回调
                }
            });
        });
    });

    function callbackdata() {
        var gid = $.trim($("#gid").val());
        var menu_Num = $.trim($("#menu_Num").val());
        var menu_Name = $.trim($("#menu_Name").val());
        var menu_Url = $.trim($("#menu_Url").val());
        var menu_Icon = $.trim($("#menu_Icon").val());
        var menu_IsShow = $.trim($("#menu_IsShow").val());
        var menu_ParentID = $.trim($("#menu_ParentID").val());
        var menu_ParentName = $.trim($("#menu_ParentName").val());
        var obj = {
            "gid":gid,
            "menu_Num": menu_Num,
            "menu_Name": menu_Name,
            "menu_Url": menu_Url,
            "menu_Icon": menu_Icon,
            "menu_IsShow": menu_IsShow,
            "menu_ParentID": menu_ParentID,
            "menu_ParentName": menu_ParentName
        };
        return JSON.stringify(obj);
    }

    function GetFunctions() {
        var funs = [];
        $.each($("input[name=Function_ID]"), function (i, e) {
            if ($(this).prop("checked")) {
                funs.push({
                    menuFunction_FunctionID: $(this).val()
                });
            }
        });
        return JSON.stringify(funs);
    }
</script>
